<template>
	<z-container leftIconSize="0">
		<view class="ss-flex-col ss-col-center">
			<uv-gap height="84rpx"></uv-gap>
			<z-image :src="config.minapplogo" width="176rpx" height="176rpx" radius="32rpx"></z-image>
			<view class="ss-m-t-24 font-w-500 fs-32">百当匠轮工坊</view>
		</view>
		<view class="ss-p-x-48 box-sizing">
			<uv-gap height="136rpx"></uv-gap>
			<view class="fc-dark2 fs-32 font-w-500">用户名</view>
			<uv-gap height="32rpx"></uv-gap>
			<uv-input v-model="form.account" placeholder="请输入用户名" border="none" :customStyle="customStyle" fontSize="32rpx" :placeholderStyle="placeholderStyle"></uv-input>
			<uv-gap height="32rpx"></uv-gap>
			<view class="fc-dark2 fs-32 font-w-500">密码</view>
			<uv-gap height="32rpx"></uv-gap>
			<uv-input v-model="form.password" placeholder="请输入登录密码" :password="state.isEye" border="none" :customStyle="customStyle" fontSize="32rpx" :placeholderStyle="placeholderStyle">
				<template #suffix>
					<z-icon @tap="state.isEye = !state.isEye" :name="!state.isEye?'eye-yes':'eye-no'" size="40rpx"></z-icon>
				</template>
			</uv-input>
			<uv-gap height="108rpx"></uv-gap>
			<z-button @tap="loginSubmit">登录</z-button>
			<view @tap="sheep.$router.back()" class="ss-font-32 ss-m-t-40 no-login-text ss-text-center">暂不登录</view>
		</view>
	</z-container>
</template>

<script setup>
	import sheep from "@/sheep"
	const config = computed(() => sheep.$store('app').configInfo)
	const customStyle = {
		width: '654rpx',
		height: '112rpx',
		background: '#F6F7F8',
		borderRadius: '4rpx',
		padding:'32rpx 40rpx',
		boxSizing: 'border-box',		
	}
	const placeholderStyle = "fontSize: 32rpx,color: #BBBBBB"
	onShow(() => {
		if(sheep.$store('user').isLogin) return sheep.$router.go('/pages/index/index')
	})
	const state = reactive({
		isEye:true
	})
	const form = reactive({
		account:'',
		password:''
	})
	 async function loginSubmit(){
		const { code,data } = await sheep.$api.user.minilogin(form)
		if(code != 1) return
		sheep.$store('user').setToken(data.userinfo?.token)
	}
</script>

<style>
	page {
		background-color: #fff;
	}
</style>
<style lang="scss" scoped>
	.no-login-text {
		color: #C5C5C5;
	}
</style>
